<!DOCTYPE html>
<html lang="zh_CN" xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout">

<head>
    <div data-th-replace="layout/head-top"></div>
</head>
<body class="gray-bg">
    <div class="wrapper wrapper-content animated fadeInLeft">
        <div>
            <div class="row">
                <!--第三步 开始 -->
                <div class="pt10">
                    <div class="col-sm-12">
                        <div class="ibox float-e-margins">
                            <div class="ibox-title">
                                <h5>目录信息</h5>
                            </div>
                            <div class="ibox-content clearfix pt10">
                                <input id="subjectIds" th:value="${course['subjectIds']}" type="hidden"/>
                                <form id="catalogForm">
                                    <input name="id" th:value="${catalog['id']}" type="hidden"/>
                                    <input id="courseId" name="courseId" th:value="${catalog['courseId']}" type="hidden"/>
                                    <input name="parentId" th:value="${catalog['parentId']}" type="hidden"/>
                                    <input name="mouldId" th:value="${catalog['mouldId']}" type="hidden"/>
                                    <input name="materialId" th:value="${catalog['materialId']}" type="hidden"/>
                                    <input name="datums" th:value="${catalog['datums']}" type="hidden"/>
                                    <input name="materialTypeKey" th:value="${catalog['materialTypeKey']}" type="hidden" />
                                    <input name="lorePointIds" th:value="${catalog['lorePointIds']}" type="hidden"/>
                                    <input name="questionIds" th:value="${catalog['questionIds']}" type="hidden" />
                                    <input name="practice" th:value="${catalog['practice']}" type="hidden" />
                                    <input  name="nodeType" type="hidden" th:value="${catalog['nodeType']}"/>
                                    <div class="form-horizontal">
                                        <div class="form-group">
                                            <label class="col-sm-2 control-label text-right"><i class="c-red">*</i> 节点类型</label>
                                            <div class="col-sm-8">
                                                <select th:disabled="(${catalog['id']} !=null and ${catalog['id']} > 0) or (${catalog['parentId']} >0)" id="nodeType" class="form-control mb10"  data-placeholder="节点类型">
                                                    <option th:selected="${catalog['nodeType']}==1" value="1">章类型</option>
                                                    <option th:selected="${catalog['nodeType']}==2 or ${catalog['parentId']} >0" value="2">节类型</option>
                                                </select>
                                                <span class="help-block m-b-none c-999">节点类型，章类型不可设置学习内容，只有节类型可以设置学习内容，设置后不可修改</span>
                                            </div>
                                        </div>
                                        <div class="hr-line-dashed"></div>
                                        <div class="form-group">
                                            <label class="col-sm-2 control-label text-right"><i class="c-red">* </i><span class="catalog_name" th:text="${catalog['nodeType']}==1?'章节名称':'节点名称'" ></span> </label>
                                            <div class="col-sm-8">
                                                <input class="form-control" name="catalogName" id="catalogName" th:value="${catalog['catalogName']}"/>
                                                <span class="help-block m-b-none c-999" th:text="(${catalog['nodeType']}==1?'章节名称':'节点名称')+' 限30个字符以内'"></span>
                                            </div>
                                        </div>
                                        <div class="hr-line-dashed"></div>
                                        <div id="node-type-2" th:classappend="(${catalog['parentId']} >0  or ${catalog['nodeType']}==2) ? '':'hide'">
                                            <div class="form-group">
                                                <label class="col-sm-2 control-label text-right">对应教学资源</label>
                                                <div class="col-sm-8">
                                                    <div>
                                                        <button class="btn btn-primary " type="button" id="selectMaterial">
                                                            <i class="fa fa-mouse-pointer"></i>&nbsp;选择素材
                                                        </button>
                                                        <button class="btn btn-primary " type="button" id="createMaterial">
                                                            <i class="fa fa-plus"></i>&nbsp;新建素材
                                                        </button>
                                                    </div>
                                                    <span class="help-block m-b-none c-999">资源指章节关联的素材</span>
                                                    <div class="col-sm-12 pt10">
                                                        <div class="mt10 no-padding ml10">
                                                            <blockquote>
                                                                <ul class="list-group" id="materialList">
                                                                    <li th:if="${#maps.isEmpty(catalog['material'])}" id="not-material" class="list-group-item">
                                                                        <span class="fs12">&nbsp;&nbsp;暂未选择或创建素材数据</span>
                                                                    </li>
                                                                    <li th:if="!${#maps.isEmpty(catalog['material'])}" class="list-group-item">
                                                                        <span class="fs12">&nbsp;&nbsp;
                                                                            <span th:text="${catalog['material']['name']}"></span>
                                                                        </span>
                                                                    </li>
                                                                </ul>
                                                            </blockquote>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div th:classappend="${catalog['nodeType']}  ==1  ? 'hide':''">
                                                <div class="form-group">
                                                    <label class="col-sm-2 control-label text-right">资源时长</label>
                                                    <div class="col-sm-8">
                                                        <input class="form-control" name="videoDuration" id="videoDuration" th:value="${catalog['videoDuration']}" readonly="readonly"/>
                                                    </div>
                                                </div>
                                            </div>
                                            <div id="audition-box" th:class="${#strings.isEmpty(catalog['materialTypeKey'])} or ${catalog['materialTypeKey']}=='VIDEO' or ${catalog['materialTypeKey']}=='AUDIO'?'':'hide'">
                                                <div class="hr-line-dashed"></div>
                                                <!-- 仅音、视频可以试听(针对素材) -->
                                                <div class="form-group">
                                                    <label class="col-sm-2 control-label text-right"> 是否允许试听</label>
                                                    <div class="col-sm-8">
                                                        <div class="radio i-checks">
                                                            <label><input type="radio" th:checked="${#strings.isEmpty(catalog['audition'])} or ${catalog['audition']}==1" value="1" name="audition"> <i></i> 否</label>
                                                            <label> <input type="radio" th:checked="${catalog['audition']}==2" value="2" name="audition"> <i></i> 是</label>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>

                                            <div id="live-time-box" th:class="${catalog['materialTypeKey']}=='LIVE'?'':'hide'">
                                                <div class="hr-line-dashed"></div>
                                                <div class="form-group">
                                                    <label class="col-sm-2 control-label text-right"> 直播时间</label>
                                                    <div class="col-sm-8">
                                                        <input class="form-control layer-date laydate-icon" name="lessonStartTime" readonly id="lessonStartTime" th:value="${catalog['lessonStartTime']}" placeholder="yyyy-MM-dd HH:mm:ss">
                                                        _
                                                        <input class="form-control layer-date laydate-icon" name="lessonEndTime" readonly id="lessonEndTime" th:value="${catalog['lessonEndTime']}" placeholder="yyyy-MM-dd HH:mm">
                                                        <span class="help-block m-b-none c-999">   章节对应直播的时间</span>
                                                    </div>
                                                </div>
                                                <div class="hr-line-dashed"></div>
                                                <div class="form-group ">
                                                    <label class="col-sm-2 control-label text-right"> 允许回放</label>
                                                    <div class="col-sm-8">
                                                        <div class="checkbox i-checks">
                                                            <label style="padding: 0">
                                                                <input type="checkbox" th:checked="${catalog['replay']}==1" value="1" name="replay" id="replay"/>允许回放
                                                            </label>
                                                        </div>
                                                        <span class="help-block m-b-none c-999"> 免费直播直播结束后是否允许回放。回放将在直播结束后一段时间后可用</span>
                                                    </div>
                                                </div>
                                                <div id="backCodeOne" class="hr-line-dashed" th:classappend="${catalog['replay']}==1 and ${vlasProviderMap.type} == 'CC' ?'':'hide'"></div>
                                                <div class="form-group" id="backCodeTwo"  th:classappend="${catalog['replay']}==1 and ${vlasProviderMap.type} == 'CC' ?'':'hide'">
                                                    <div class="form-group">
                                                        <th:block th:if="${playback}!=null">
                                                            <label class="col-sm-2 control-label text-right">回放地址</label>
                                                            <div class="col-sm-5">
                                                                <select  id="backUrl" class="form-control mb 10"  >
                                                                    <option value="">请根据录制结束时间选择</option>
                                                                    <option th:each=" back:${playback}" th:selected="${catalog['backCode']} eq ${back['replayUrl']}"  th:attrappend="data-live=${back['liveId']},data-playback=${back['id']}" th:value="${back['replayUrl']}" th:text="${back['stopTime']}+(${back['replayUrl']}==null or ${back['replayUrl']} eq ''?'（回放地址处理中请稍后再试）':'')"></option>
                                                                </select>
                                                                <span class="help-block m-b-none c-999">显示为直播录制结束的时间节点（回放地址和回放视频码只能二选一）</span>
                                                            </div>
                                                        </th:block>
                                                    </div>
                                                    <div class="form-group">
                                                        <label class="col-sm-2 control-label text-right">回放视频码</label>
                                                        <div class="col-sm-5">
                                                            <button class="btn btn-primary btn-outline" type="button" id="uploadVideo">
                                                                <i class="fa fa-plus"></i>&nbsp;上传回放视频
                                                            </button>
                                                            <span> 或 </span>
                                                            <button class="btn btn-primary btn-outline" type="button" id="selectVideo">
                                                                <i class="fa fa-mouse-pointer"></i>&nbsp;选择回放视频码
                                                            </button>
                                                        </div>
                                                    </div>
                                                    <div class="form-group">
                                                        <label class="col-sm-2">&nbsp;</label>
                                                        <div class="col-sm-9">
                                                            <input class="form-control" name="backCode" id="backCode" th:value="${catalog['backCode']}"/>
                                                            <span class="help-block m-b-none c-999">直播回放视频码或回放地址，用于直播结束后的回放</span>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div id="backCodeThree" class="hr-line-dashed" th:classappend="${catalog['replay']}==1 and ${vlasProviderMap.type} == 'TT' ?'':'hide'"></div>
                                                <div class="form-group" id="backCodeFour"  th:classappend="${catalog['replay']}==1 and ${vlasProviderMap.type} == 'TT' ?'':'hide'">
                                                    <label class="col-sm-2 control-label text-right">直播回放</label>
                                                    <div class="col-sm-3">
                                                        <input class="form-control" name="backCode" readonly th:value="${catalog['backCode']}" placeholder="直播回放暂未生成，请稍后再试，或上传回放视频" />
                                                        <span class="help-block m-b-none c-999">回放视频码(直播结束自动生成,也可以自己选择视频文件)</span>
                                                    </div>
                                                    <p>
                                                        <label class="col-sm-1 control-label "> 视频码</label>
                                                        &nbsp;  &nbsp;<button class="btn btn-primary " type="button" id="uploadVideo">
                                                            <i class="fa fa-plus"></i>&nbsp;上传视频
                                                        </button>
                                                        <button class="btn btn-primary " type="button" id="selectVideo">
                                                            <i class="fa fa-mouse-pointer"></i>&nbsp;选择视频
                                                        </button>
                                                    </p>
                                                </div>
                                                <div class="hr-line-dashed"></div>
                                            </div>
                                            <div th:class="${catalog['materialTypeKey']}=='LIVE'?'hide':''" id="lessontime-box">
                                                <div class="hr-line-dashed"></div>
                                                <!-- 如果是直播课，不需要预计上传时间 -->
                                                <div class="form-group">
                                                    <label class="col-sm-2 control-label text-right"> 预计上传时间</label>
                                                    <div class="col-sm-8">
                                                        <div class="input-group m-b">
                                                            <span class="input-group-addon"><i class="fa fa-hourglass-half"></i></span>
                                                            <input class="form-control layer-date laydate-icon" name="lessonTime" id="lessonTime" th:value="!${#strings.isEmpty(catalog['lessonTime'])}?${#strings.substring(catalog['lessonTime'],0,10)}:''" placeholder="yyyy-MM-dd"/>
                                                        </div>
                                                        <span class="help-block m-b-none c-999">   预计章节下的教学资源可用时间</span>
                                                    </div>
                                                </div>
                                                <div class="hr-line-dashed"></div>
                                            </div>

                                            <div class="form-group">
                                                <label class="col-sm-2 control-label text-right"> 随堂资料</label>
                                                <div class="col-sm-8">
                                                    <div>
                                                        <button class="btn btn-primary " type="button" id="uploadDatum"><i class="fa fa-plus"></i>&nbsp;随堂资料</button>
                                                    </div>
                                                    <span class="help-block m-b-none c-999"> 随堂资料 最多可上传1个文件 格式为pdf</span>
                                                    <div class="col-sm-8 pt10">
                                                        <div class="mt10 no-padding ml10">
                                                            <blockquote>
                                                                <ul class="list-group" id="datumList">
                                                                    <li th:if="${#lists.isEmpty(catalog['datumList'])}" id="not-datum" class="list-group-item">
                                                                        <span class="fs12">&nbsp;&nbsp;暂未上传随堂资料文件数据</span>
                                                                    </li>
                                                                    <li th:if="!${#lists.isEmpty(catalog['datumList'])}" th:each="datum : ${catalog['datumList']}" th:attrappend="data-name=${datum['name']},data-url=${datum['url']}" class="list-group-item datum-li-box">
                                                                        <span class="fs12" th:utext="'&nbsp;&nbsp;'+${datum['name']}"></span>
                                                                        <span style="cursor: pointer;" data-original-title="删除" data-placement="left" data-toggle="tooltip" class="fs12 pull-right del-datum-box">
                                                                            <i class="fa fa-close"></i>
                                                                        </span>
                                                                    </li>
                                                                </ul>
                                                            </blockquote>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <th:block th:if="${course['courseTypeKey']}!='LIVE' and ${course['courseTypeKey']}!='SMALL'">
                                                <div class="hr-line-dashed"></div>
                                                <div class="form-group">
                                                    <label class="col-sm-2 control-label text-right"> 选择知识点</label>
                                                    <div class="col-sm-8">
                                                        <div>
                                                            <button class="btn btn-primary " type="button" id="selectLorePoint">
                                                                <i class="fa fa-mouse-pointer"></i>&nbsp; 选择知识点
                                                            </button>
                                                        </div>
                                                        <span class="help-block m-b-none c-999">选择随堂练习的知识点，并据此知识点选择随堂练习的试题</span>
                                                        <div class="form-group">
                                                            <div class="oc-ibox-content">
                                                                <div class="table-responsive">
                                                                    <table class="table table-bordered">
                                                                        <thead>
                                                                        <tr>
                                                                            <th class="text-center" width="80%">知识点名称</th>
                                                                            <th class="text-center" width="20%">操作</th>
                                                                        </tr>
                                                                        </thead>
                                                                    </table>
                                                                    <div class="J_V_tabContent table-xScrollWrap">
                                                                        <table class="table table-bordered table-hover table-xs-content">
                                                                            <tbody id="table-loreset-point">
                                                                            <tr class="jqgfirstrow" role="row">
                                                                                <td class="text-center" width="80%"></td>
                                                                                <td class="text-center" width="20%"></td>
                                                                            </tr>
                                                                            <tr th:if="not ${#maps.isEmpty(catalog['loresetDataMap'])}" th:each="entry : ${catalog['loresetDataMap']}" th:attr="data-ids=${entry['key']}">
                                                                                <td class="text-center" th:text="${entry['value']}"></td>
                                                                                <td class="text-center"><a href="javascript:void(0)"><i class="fa fa-trash"></i></a></td>
                                                                            </tr>
                                                                            <tr th:class="${not #maps.isEmpty(catalog['loresetDataMap'])}  ? 'hide'">
                                                                                <td colspan="3" class="text-center">
                                                                                    <div class="noDataTipsBox">
                                                                                        <p><span class="c-4e fs16">亲，一定要选择知识点~~~</span></p>
                                                                                    </div>
                                                                                </td>
                                                                            </tr>
                                                                            </tbody>
                                                                        </table>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="hr-line-dashed"></div>
                                                <div class="form-group">
                                                    <label class="col-sm-2 control-label text-right"> 随堂练习</label>
                                                    <div class="col-sm-8">
                                                        <div>
                                                            <button class="btn btn-primary " type="button" id="selectQuestion">
                                                                <i class="fa fa-mouse-pointer"></i>&nbsp;随堂练习
                                                            </button>
                                                        </div>
                                                        <span class="help-block m-b-none c-999">随堂练习只支持非真题</span>
                                                        <div class="form-group">
                                                            <div class="oc-ibox-content">
                                                                <div class="table-responsive">
                                                                    <table class="table table-bordered">
                                                                        <thead>
                                                                        <tr>
                                                                            <th class="text-center" width="10%">ID</th>
                                                                            <th class="text-center" width="70%">试题内容</th>
                                                                            <th class="text-center" width="20%">操作</th>
                                                                        </tr>
                                                                        </thead>
                                                                    </table>
                                                                    <div class="J_V_tabContent table-xScrollWrap">
                                                                        <table class="table table-bordered table-hover table-xs-content">
                                                                            <tbody id="course-catalog-question">
                                                                            <tr class="jqgfirstrow" role="row">
                                                                                <td class="text-center" width="10%"></td>
                                                                                <td class="text-center" width="70%"></td>
                                                                                <td class="text-center" width="20%"></td>
                                                                            </tr>
                                                                            <th:block th:if="not ${#maps.isEmpty(catalog['questionList'])}" th:each="question,index : ${catalog['questionList']}">
                                                                                <tr th:attr="data-question=${question['id']}, data-score=${question['score']}">
                                                                                    <td class="text-center" th:text="${question['id']}"></td>
                                                                                    <td class="text-center" th:utext="${question['templateContent']['trunk']}"></td>
                                                                                    <td class="text-center"><a href="javascript:void(0)">
                                                                                        <i class="fa fa-trash"></i></a>
                                                                                    </td>
                                                                                </tr>
                                                                            </th:block>
                                                                            <tr th:class="${not #lists.isEmpty(catalog['questionList'])} ? 'hide'">
                                                                                <td colspan="3" class="text-center">
                                                                                    <div class="noDataTipsBox">
                                                                                        <p><span class="c-4e fs16">亲，没有选择试题呢~~~</span></p>
                                                                                    </div>
                                                                                </td>
                                                                            </tr>
                                                                            </tbody>
                                                                        </table>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </th:block>
                                            <div id="article-box" th:class="${catalog['materialTypeKey']}=='ARTICLE'?'':'hide'">
                                                <div class="hr-line-dashed"></div>
                                                <!-- 仅文章课显示(选择素材时) -->
                                                <div class="form-group">
                                                    <label class="col-sm-2 control-label text-right">文章简介</label>
                                                    <div class="col-sm-8">
                                                        <div id="articleSummary" style="line-height: 28px;margin-top: 2px;" th:utext="!${#maps.isEmpty(catalog['material'])}?${catalog['material']['articleSummary']}:''">
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="hr-line-dashed"></div>
                                                <div class="form-group">
                                                    <label class="col-sm-2 control-label text-right"><i class="c-red">*</i> 文章内容</label>
                                                    <div class="col-sm-8">
                                                        <div id="articleContext" style="line-height: 28px;margin-top: 2px;" th:utext="!${#maps.isEmpty(catalog['material'])}?${catalog['material']['articleContext']}:''">
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div data-th-replace="layout/head-footer"></div>
    <script type="text/javascript" th:src="@{{path}/admin/libs/plugins/layer/laydate/laydate.js?v={v}(path=${staticPath},v=${v})}"></script>
    <script type="text/javascript" th:src="@{{path}/admin/business/upload/common-webuploader.js?v={v}(path=${staticPath},v=${v})}"></script>
    <script type="text/javascript" th:src="@{{path}/admin/business/course/material/common-create-material-win.js?v={v}(path=${staticPath},v=${v})}"></script>
    <script type="text/javascript" th:src="@{{path}/admin/business/manage/loreset/common-select-loreset-point.js?v={v}(path=${staticPath},v=${v})}"></script>
    <script type="text/javascript" th:src="@{{path}/admin/business/exam/question/common-select-question.js?v={v}(path=${staticPath},v=${v})}"></script>
    <script type="text/javascript" th:src="@{{path}/admin/business/course/material/select-material.js?v={v}(path=${staticPath},v=${v})}"></script>
    <script th:src="@{{path}/admin/business/course/cloud/select-common-video.js?v={v}(path=${staticPath},v=${v})}"></script>
    <script type="text/javascript" th:src="@{{path}/admin/business/course/catalog/save_catalog.js?v={v}(path=${staticPath},v=${v})}"></script>
    <script th:inline="javascript">
        var LiveType = [[${vlasProviderMap.type}]];
    </script>
</body>
</html>
